<!-- 用能对比分析 -->
<template>
  <div class="energyContrast5">
    <div class="ScreeningConditions card">
      <h2>选择分析时段</h2>
      <div class="timeInterval">
        <span style="padding-right: 20px;line-height: 100%;">班组时段</span>
        <el-checkbox-group v-model="checkedCities0" :min="1" style="width: 860px;">
          <el-checkbox v-for="(item,index) in teamList" :label='item' :key="index">{{item.team}}{{item.time}}</el-checkbox>
        </el-checkbox-group>
      </div>
      <h2>选择分析周期</h2>
      <div class="cycle" style="margin:0 20px;padding-bottom:20px;border-bottom: 1px solid #E9E9E9;">
        <el-radio v-model="radio" label="0">
          <template>
            <el-date-picker style="width:140px" v-model="Starttime" :editable='false' :clearable="false" :type='DateType1' :format="DateType2" :value-format='DateType2' :picker-options="pickerOptions" placeholder="选择日期时间">
            </el-date-picker>
            <i class='el-icon-minus' style="color: #333333;margin:0px 15px"></i>
            <el-tooltip content="查询时间跨度最小为7天，最大为92天" placement="top">
              <el-date-picker style="width:140px" v-model="Endtime" :editable='false' :clearable="false" :type='DateType1' :format="DateType2" :value-format='DateType2' :picker-options="pickerOptions" placeholder="选择日期时间">
              </el-date-picker>
            </el-tooltip>
          </template>
        </el-radio>
        <el-radio v-model="radio" label="1" :disabled="thisMonth">本月</el-radio>
        <el-radio v-model="radio" label="2">最近1个月</el-radio>
        <el-radio v-model="radio" label="3">最近3个月</el-radio>
      </div>
      <div class="head_foot" style="text-align: center;padding-bottom: 20px;padding-top: 18px;">
        <el-button type="primary" :loading="queryloding" @click="query()">查询</el-button>
      </div>
    </div>
    <el-row class='card ectop'>
      <el-col>
        <h2 style="color: #0780ED;background: #EEF4FC;border-bottom: 1px solid #0780ED;margin-top:15px;margin-bottom:20px">
          <i style="font-size:30px;padding-right: 10px;" class="icon iconfont icon-company"></i><span>企业用能对比分析</span>
        </h2>
        <!-- <Mtitle title='企业用能对比分析'></Mtitle> -->
        <table1 :companyData="companyData" :companyData2="companyData2" :level="'车间'" v-loading='companyLoading'></table1>
      </el-col>
    </el-row>

    <el-row class='card ectop'>
      <el-col>
        <Mtitle class='body_canvas'>
          <div class="twospan">
            <span v-if="companyelectricFlag" @click="application1=1,companyCurve()" :class="{'active':application1==1}">用电</span>
            <span v-if="companysteamFlag" @click="application1=2,companyCurve()" :class="{'active':application1==2}">用汽</span>
          </div>
          <div>
            <el-checkbox-group class="can_check" v-model="checkedCities1" :max="3" :min="1" @change="companychange()">
              <el-checkbox :disabled="disbox" v-for="(item,index) in teamZList" :label='item' :key="index">{{item.team}}{{item.time}}</el-checkbox>
            </el-checkbox-group>
          </div>
        </Mtitle>
        <!-- <linechart height="400px"  v-loading='company_canvas_Loading' :linedata='linedata' :Comp="application1==1?'kWh':'t'"></linechart> -->
        <ecline v-loading='line_canvas_Loading' height="400px" :ecdata='linedata' :unit="application1==1?'kWh':'t'"></ecline>
      </el-col>
    </el-row>
    <el-row class='card ectop'>
      <el-col>
        <Mtitle>
          <div><i style="font-size:26px;color: #9B9B9B;line-height: 52px;padding-right: 9px;" class="icon iconfont icon-chejian"></i><span>车间用能对比分析</span></div>
          <div>
            <span style="padding-right: 10px;font-size: 14px;">车间</span>
            <el-select :disabled="disbox" style="width: 150px;" v-model="value_time" placeholder="" @change="clicklistOne0()">
              <el-option v-for="item in options_time" :key="item.id" :label="item.name" :value="item.id">
              </el-option>
            </el-select>
          </div>
        </Mtitle>
        <table1 :companyData="workShopData" :companyData2="workShopData2" :level="'生产线'" v-loading='workShopLoading'></table1>
      </el-col>
    </el-row>
    <el-row class='card ectop'>
      <el-col>
        <Mtitle class='body_canvas'>
          <div class="twospan">
            <span v-if="workshopelectricFlag" @click="application2=1,getworkShopCurve(value_time)" :class="{'active':application2==1}">用电</span>
            <span v-if="workshopsteamFlag" @click="application2=2,getworkShopCurve(value_time)" :class="{'active':application2==2}">用汽</span>
          </div>
          <div>
            <el-checkbox-group class="can_check" v-model="checkedCities2" :max="3" :min="1" @change="workShopchange()">
              <el-checkbox :disabled="disbox" v-for="(item,index) in teamZList" :label='item' :key="index">{{item.team}}{{item.time}}</el-checkbox>
            </el-checkbox-group>
          </div>
        </Mtitle>
        <!-- <linechart height="400px" v-loading='workShop_canvas_Loading' :linedata='workShopCurve' :Comp="application2==1?'kWh':'t'"></linechart> -->
        <ecline v-loading='line_canvas_Loading' height="400px" :ecdata='workShopCurve' :unit="application2==1?'kWh':'t'"></ecline>
      </el-col>
    </el-row>
    <el-row class='card ectop'>
      <el-col>
        <Mtitle title="生产线用能对比分析">
          <div>
            <span style="padding:0 10px;font-size: 14px;">车间</span>
            <el-select :disabled="disbox" style="width: 150px;" v-model="value_time1" placeholder="" @change="clicklistOne()">
              <el-option v-for="item in options_time" :key="item.id" :label="item.name" :value="item.id">
              </el-option>
            </el-select>
            <span style="padding: 0 10px;font-size: 14px;">生产线</span>
            <el-select :disabled="disbox" style="width: 150px;" v-model="value_time2" placeholder="" @change="clicklistTwo()">
              <el-option v-for="item in options_time2" :key="item.id" :label="item.name" :value="item.id">
              </el-option>
            </el-select>
          </div>
        </Mtitle>
        <table1 :companyData="lineListData" :companyData2="lineListData2" :level="'日期'" v-loading='lineLoading'></table1>
      </el-col>
    </el-row>
    <el-row class='card ectop'>
      <el-col>
        <Mtitle class='body_canvas'>
          <div class="twospan">
            <span v-if="lineelectricFlag" @click="application3=1,getlineCurve(value_time2)" :class="{'active':application3==1}">用电</span>
            <span v-if="linesteamFlag" @click="application3=2,getlineCurve(value_time2)" :class="{'active':application3==2}">用汽</span>
          </div>
          <div>
            <el-checkbox-group class="can_check" v-model="checkedCities3" :max="3" :min="1" @change="linechange()">
              <el-checkbox :disabled="disbox" v-for="(item,index) in teamZList" :label='item' :key="index">{{item.team}}{{item.time}}</el-checkbox>
            </el-checkbox-group>
          </div>
        </Mtitle>
        <!-- <linechart height="400px" v-loading='workShop_canvas_Loading' :linedata='workShopCurve' :Comp="application2==1?'kWh':'t'"></linechart> -->
        <ecline v-loading='line_canvas_Loading' height="400px" :ecdata='lineCurce' :unit="application3==1?'kWh':'t'"></ecline>
      </el-col>
    </el-row>
  </div>
</template>
<script>
import ecline from '@/components/echarts/ec_line'
import day from "@/utils/day.js";
import Mtitle from '@/components/Mtitle'
import tb from '@/components/table'
import table1 from "./table";
// import linechart from "./echart";
import './index.scss'
export default {
  components: {
    table1,
    // linechart,
    Mtitle,
    tb,
    ecline
  },
  props: {

  },
  data() {
    return {
      disbox: false,
      //三个loading
      companyLoading: true,
      workShopLoading: true,
      lineLoading: true,
      company_canvas_Loading: true,
      workShop_canvas_Loading: true,
      line_canvas_Loading: true,
      //公司表格数据
      companyData: {
        electricFlag: null,
        electricList: [],
        electricStable: null,
        electricVolatility: null,
        monthRange: "-",
        steamFlag: null,
        steamList: [],
        steamStable: null,
        steamVolatility: null,
      },
      companyData2: {
        electricFlag: null,
        electricList: [],
        electricStable: null,
        electricVolatility: null,
        monthRange: "-",
        steamFlag: null,
        steamList: [],
        steamStable: null,
        steamVolatility: null,
      },
      //车间列表数据

      workShopData: {
        electricFlag: false,
        electricList: [],
        electricStable: null,
        electricVolatility: null,
        monthRange: "-",
        steamFlag: false,
        steamList: [],
        steamStable: null,
        steamVolatility: null,
      },
      workShopData2: {
        electricFlag: false,
        electricList: [],
        electricStable: null,
        electricVolatility: null,
        monthRange: "-",
        steamFlag: false,
        steamList: [],
        steamStable: null,
        steamVolatility: null,
      },
      //  	生产线列表数据
      lineListData: {
        electricFlag: false,
        electricList: [],
        electricStable: null,
        electricVolatility: null,
        monthRange: "-",
        steamFlag: false,
        steamList: [],
        steamStable: null,
        steamVolatility: null,
      },
      lineListData2: {
        electricFlag: false,
        electricList: [],
        electricStable: null,
        electricVolatility: null,
        monthRange: "-",
        steamFlag: false,
        steamList: [],
        steamStable: null,
        steamVolatility: null,
      },
      //车间曲线数据
      workShopCurce: [{ name: '', list: [] }],
      //生产线曲线
      lineCurce: [{ name: '', list: [] }],
      queryloding: false,
      //公司用电用汽是否存在
      companyelectricFlag: false,
      companysteamFlag: false,
      //车间用电用汽是否存在
      workshopelectricFlag: false,
      workshopsteamFlag: false,
      //生产线用电用汽是否存在
      lineelectricFlag: false,
      linesteamFlag: false,
      //  	两个下拉框
      options_time: '',
      options_time2: '',
      //公司接口是否返回
      companynum: 0,
      workShopnum: 0,
      linenum: 0,
      //  	班组
      teamList: [],
      teamZList: [],
      linedata: [{ name: '', list: [] }],
      workShopCurve: [{}],
      //用电 or 用汽 默认选中
      application1: 1,
      application2: 1,
      application3: 1,
      //四个班组选中数据
      checkedCities0: [],
      checkedCities1: [],
      checkedCities2: [],
      checkedCities3: [],
      //选中班组之后对应的给后台反的数据
      teamList0: [],
      teamList1: [],
      teamList2: [],
      teamList3: [],
      //    周期radio
      radio: '0',
      value_time: '',
      value_time1: '',
      value_time2: '',
      // 年 月 日
      TodayTime1: "",
      TodayTime2: "",
      TodayTime3: "",
      // 开始时间
      Starttime: "",
      // 结束时间
      Endtime: "",
      // 最终时间类型
      DateType: "y",
      // 日期类型
      DateType1: "date",
      // 日期显示类型
      DateType2: "yyyy-MM-dd",
      pickerOptions: {
        disabledDate(time) {
          return time.getTime() > Date.now() - 1000 * 60 * 60 * 24;
        }
      },
    };
  },
  mounted() {

  },
  watch: {
    companynum(a, b) {
      if (a == 1) {
        //用电回来了
        if (this.companyelectricFlag == true) {
          this.application1 = 1
          this.companyCurve()
        }
      }
      if (a == 2) {
        //用汽回来了
      }
      if (a == 3) {
        //都回来了&&汽先回来的
        if (this.companyelectricFlag == false && this.companysteamFlag == true) {
          this.application1 = 2
          this.companyCurve()
        } else if (this.companyelectricFlag == true) {
          this.application1 = 1
          this.companyCurve()
        }
      }
    },
    workShopnum(a, b) {
      if (a == 1) {
        //用电回来了
        if (this.workshopelectricFlag == true) {
          this.application2 = 1
          this.getworkShopCurve(this.value_time)
        }
      }
      if (a == 2) {
        //用汽回来了
      }
      if (a == 3) {
        //都回来了&&汽先回来的
        if (this.workshopelectricFlag == false && this.workshopsteamFlag == true) {
          this.application2 = 2
          this.getworkShopCurve(this.value_time)
        } else if (this.workshopelectricFlag == true) {
          this.application2 = 1
          this.getworkShopCurve(this.value_time)
        }
      }
    },
    linenum(a, b) {
      //		console.log(a,b)
      if (a == 1) {
        //用电回来了
        if (this.lineelectricFlag == true) {
          this.application3 = 1
          this.getlineCurve(this.value_time2)
        }
      }
      if (a == 2) {
        //用汽回来了
      }
      if (a == 3) {
        //都回来了&&汽先回来的
        if (this.lineelectricFlag == false && this.linesteamFlag == true) {
          this.application3 = 2
          this.getlineCurve(this.value_time2)
        } else if (this.lineelectricFlag == true) {
          this.application3 = 1
          this.getlineCurve(this.value_time2)
        }
      }
    },
    //监听班组裂变默认前三选中
    teamList() {
      this.defaultThree()
    },
    //	车间下拉框数据变化触发请求数据方法
    //	value_time(a,b){
    //		this.getworkShopList(a)
    //	},
    //	//生产线第二个下拉框数据变化触发请求数据方法
    //	value_time2(a,b){
    //		this.getlineList(a)
    //	},
    //		value_time1(a,b){
    //			console.log(1111,a,b)
    //			this.postfindMeters(a)
    //		},
    radio() {
      this.defa7()
    }
  },
  computed: {
    thisMonth() {
      //一号本月选项不能点
      let myDate = new Date()
      return myDate.getDate() == 1
    },
    //判断当前radio是否为0
    cycleType() {
      if (this.radio == 0) {
        return {
          dateType: +this.radio,
          startDate: this.Starttime,//this.Starttime
          endDate: this.Endtime//this.Endtime
        }
      } else {
        return {
          dateType: +this.radio,
          startDate: '-',
          endDate: '-'
        }
      }
    }
  },
  methods: {
    //点击查询
    query() {
      this.defaultThree()
      if (this.radio == 0) {
        var userAgent = navigator.userAgent;
        var isOpera = userAgent.indexOf("Opera") > -1;
        var isIE = userAgent.indexOf("compatible") > -1 && userAgent.indexOf("MSIE") > -1;
        var isEdge = userAgent.indexOf("Edge") > -1 && !isIE;
        var isIE11 = userAgent.indexOf('Trident') > -1 && userAgent.indexOf("rv:11.0") > -1;
        isIE = isIE && !isOpera || isEdge || isIE11;

        if (isIE) {
          this.Starttime = this.Starttime.replace(/\-/g, '/');
          this.Endtime = this.Endtime.replace(/\-/g, '/');
        }
        if (navigator.userAgent.indexOf("Safari") > -1) {
          this.Starttime = this.Starttime.replace(/\-/g, "/");
          this.Endtime = this.Endtime.replace(/\-/g, "/");
        }
        // ------------------------分界线-------------------------------
        console.log(new Date(this.Starttime).getTime())
        if (new Date(this.Starttime).getTime() <= new Date(this.Endtime).getTime()) {
          let chatime = new Date(this.Endtime).getTime() - new Date(this.Starttime).getTime()
          if (chatime >= 3600 * 1000 * 24 * 6 && chatime <= 3600 * 1000 * 24 * 92) {
            this.Starttime = this.Starttime.replace(/\//g, '-');
            this.Endtime = this.Endtime.replace(/\//g, '-');
            this.disbox = false

            this.companyList()
            this.postfindRooms()
              .then((data) => {
                return this.postfindMeters(data)
              })
          } else {
            this.Starttime = this.Starttime.replace(/\//g, '-');
            this.Endtime = this.Endtime.replace(/\//g, '-');
            this.$message('时间区间最小为7天，最大为92天');
            this.disbox = true
          }



        } else {
          this.Starttime = this.Starttime.replace(/\//g, '-');
          this.Endtime = this.Endtime.replace(/\//g, '-');
          this.$message('开始时间不能大于结束时间');
          this.disbox = true
        }
      } else {
        this.disbox = false
        this.companyList()
        this.postfindRooms()
          .then((data) => {
            return this.postfindMeters(data)
          })
      }

    },
    //	点击车间下拉
    clicklistOne0() {

      if (this.radio == 0) {
        if (new Date(this.Starttime).getTime() <= new Date(this.Endtime).getTime()) {
          let chatime = new Date(this.Endtime).getTime() - new Date(this.Starttime).getTime()
          if (chatime >= 3600 * 1000 * 24 * 6 && chatime <= 3600 * 1000 * 24 * 92) {
            this.getworkShopList(this.value_time)
          } else {
            this.$message('时间区间最小为7天，最大为92天');
          }
        } else {
          this.$message('开始时间不能大于结束时间');
        }
      } else {
        this.getworkShopList(this.value_time)
      }
    },
    //	点击生产线下拉
    clicklistOne() {

      if (this.radio == 0) {
        if (new Date(this.Starttime).getTime() <= new Date(this.Endtime).getTime()) {
          let chatime = new Date(this.Endtime).getTime() - new Date(this.Starttime).getTime()
          if (chatime >= 3600 * 1000 * 24 * 6 && chatime <= 3600 * 1000 * 24 * 92) {
            this.postfindMeters(this.value_time1)
          } else {
            this.$message('时间区间最小为7天，最大为92天');
          }
        } else {
          this.$message('开始时间不能大于结束时间');
        }
      } else {
        this.postfindMeters(this.value_time1)
      }
    },
    //	点击生产线第二个下拉列表
    clicklistTwo() {

      if (this.radio == 0) {
        if (new Date(this.Starttime).getTime() <= new Date(this.Endtime).getTime()) {
          let chatime = new Date(this.Endtime).getTime() - new Date(this.Starttime).getTime()
          if (chatime >= 3600 * 1000 * 24 * 6 && chatime <= 3600 * 1000 * 24 * 92) {
            this.getlineList(this.value_time2)
          } else {
            this.$message('时间区间最小为7天，最大为92天');
          }
        } else {
          this.$message('开始时间不能大于结束时间');
        }
      } else {
        this.getlineList(this.value_time2)
      }
    },
    getFormatDate(timestamp) {
      var newDate = new Date(timestamp);
      Date.prototype.format = function (format) {
        var date = {
          'M+': this.getMonth() + 1,
          'd+': this.getDate(),
          'h+': this.getHours(),
          'm+': this.getMinutes(),
          's+': this.getSeconds(),
          'q+': Math.floor((this.getMonth() + 3) / 3),
          'S+': this.getMilliseconds()
        };
        if (/(y+)/i.test(format)) {
          format = format.replace(RegExp.$1, (this.getFullYear() + '').substr(4 - RegExp.$1.length));
        }
        for (var k in date) {
          if (new RegExp('(' + k + ')').test(format)) {
            format = format.replace(RegExp.$1, RegExp.$1.length == 1
              ? date[k] : ('00' + date[k]).substr(('' + date[k]).length));
          }
        }
        return format;
      }
      return newDate.format('yyyy-MM-dd');
    },
    //请求车间数据
    postfindRooms() {
      let prodata = new Promise((resolve, reject) => {
        this.$axios.post(this.Eelec + '/workshop/getWorkshop', {
          'custID': sessionStorage.getItem('custId')
        }).then(res => {
          if (res.data.code == 200) {
            this.options_time = res.data.data
            this.value_time1 = res.data.data[0].id
            this.value_time = res.data.data[0].id
            this.getworkShopList(this.value_time)
            resolve(res.data.data[0].id)
          }
        }).catch(err => {
          console.log(err)
        })
      })
      return prodata
    },
    //请求第二个下拉框数据
    postfindMeters(data) {
      let prodata2 = new Promise((resolve, reject) => {
        this.$axios.post(this.Eelec + '/workshop/getProductionLine', {
          "id": data
        }).then(res => {
          if (res.data.code == 200) {
            this.value_time2 = ''
            this.options_time2 = res.data.data
            this.value_time2 = res.data.data[0].id
            this.getlineList(this.value_time2)
            resolve(res.data.data[0].id)
          }
        }).catch(err => {
          console.log(err)
        })

      })
      return prodata2
    },
    //获取班组信息
    getteams() {
      this.$axios.post(this.Eelec + '/ennergy/comparativeAnalysis/teams', {
        'custID': sessionStorage.getItem('custId')
      }).then(res => {
        if (res.data.code == 200) {
          this.teamList = res.data.data.teamList.map((item, ind) => {
            Object.assign(item, { index: ind })
            return item
          })
          this.teamZList = res.data.data.teamList.map((item, ind) => {
            Object.assign(item, { index: ind })
            return item
          })
          this.checkedCities0 = res.data.data.teamList.map((item, ind) => {
            Object.assign(item, { index: ind })
            return item
          })
          this.companyList()
          this.postfindRooms()
            .then((data) => {
              return this.postfindMeters(data)
            })
        }
      }).catch(err => {
        console.log(err)
      })
    },
    //获取企业用能对比分析
    companyList() {
      this.companyData = {}
      this.companyData2 = {}
      this.linedata = [{ name: '', list: [] }]
      this.companynum = 0
      this.companyLoading = true
      this.queryloding = true
      this.company_canvas_Loading = true
      let a = {}
      let b = {}
      Object.assign(a, this.cycleType,
        {          teamList: this.checkedCities0,
          "energyType": '01',
        },
        { 'unitId': sessionStorage.getItem('custId') },
      );
      Object.assign(b, this.cycleType,
        {          teamList: this.checkedCities0,
          "energyType": '02',
        },
        { 'unitId': sessionStorage.getItem('custId') },
      );
      this.$axios.post(this.Eelec + '/ennergy/comparativeAnalysis/companyList',
        a
      ).then(res => {
        this.queryloding = false
        this.companyLoading = false
        this.company_canvas_Loading = false
        if (res.data.code == 200) {
          this.companyData = res.data.data
          //					判断是否有对应的用电和用汽数据
          this.companyelectricFlag = res.data.data.electricFlag
          this.companynum += 1

        }
      }).catch(err => {
        console.log(err)
      })
      this.$axios.post(this.Eelec + '/ennergy/comparativeAnalysis/companyList',
        b
      ).then(res => {
        this.queryloding = false
        this.companyLoading = false
        if (res.data.code == 200) {
          this.companyData2 = res.data.data
          this.companysteamFlag = res.data.data.steamFlag
          this.companynum += 2

        }
      }).catch(err => {
        console.log(err)
      })
    },
    //		公司曲线
    companyCurve() {
      this.linedata = [{ name: '', list: [] }]
      this.company_canvas_Loading = true
      let a = {}
      Object.assign(a, this.cycleType,
        { teamList: this.checkedCities1 },
        { 'unitId': sessionStorage.getItem('custId'), },
        { energyType: '0' + this.application1 },
      );
      this.$axios.post(this.Eelec + '/ennergy/comparativeAnalysis/companyCurve',
        a
      ).then(res => {
        this.company_canvas_Loading = false
        if (res.data.code == 200) {

          if (res.data.data[0]) {
            // this.linedata = res.data.data
            this.linedata = res.data.data.map((item, index) => {
              return {
                name: item.team,
                value: item.list
              }
            })

          } else {
            this.linedata = [{ name: '', list: [] }]
          }
          //       	console.log(res.data.data)
        } else {
          this.linedata = [{ name: '', list: [] }]
        }
      }).catch(err => {

        console.log(err)
      })
    },
    //		车间列表
    getworkShopList(id) {
      this.workShopData = {}
      this.workShopData2 = {}
      this.workShopCurve = [{ name: '', list: [] }]
      this.workShopnum = 0
      this.workShopLoading = true
      this.workShop_canvas_Loading = true
      let a = {}
      let b = {}
      Object.assign(a, this.cycleType,
        {          teamList: this.checkedCities0,
          "energyType": '01',
        },
        { unitId: id.toString() }//
      );
      Object.assign(b, this.cycleType,
        {          teamList: this.checkedCities0,
          "energyType": '02',
        },
        { unitId: id.toString() }//
      );
      this.$axios.post(this.Eelec + '/ennergy/comparativeAnalysis/workShopList',
        a
      ).then(res => {
        this.workShopLoading = false
        this.workShop_canvas_Loading = false
        if (res.data.code == 200) {
          this.workShopData = res.data.data
          this.workshopelectricFlag = res.data.data.electricFlag
          this.workShopnum += 1
        }
      }).catch(err => {
        console.log(err)
      })
      this.$axios.post(this.Eelec + '/ennergy/comparativeAnalysis/workShopList',
        b
      ).then(res => {
        this.workShopLoading = false
        if (res.data.code == 200) {
          this.workShopData2 = res.data.data
          this.workshopsteamFlag = res.data.data.steamFlag
          this.workShopnum += 2
        }
      }).catch(err => {
        console.log(err)
      })
    },
    //车间曲线
    getworkShopCurve(id) {
      this.workShopCurve = [{ name: '', list: [] }]
      this.workShop_canvas_Loading = true
      let a = {}
      Object.assign(a, this.cycleType,
        { teamList: this.checkedCities2 },
        { energyType: '0' + this.application2 },
        { unitId: id.toString() }
      );
      this.$axios.post(this.Eelec + '/ennergy/comparativeAnalysis/workShopCurve',
        a
      ).then(res => {
        this.workShop_canvas_Loading = false
        if (res.data.code == 200) {
          if (res.data.data[0]) {
            // this.workShopCurve = res.data.data
            this.workShopCurve = res.data.data.map((item, index) => {
              return {
                name: item.team,
                value: item.list
              }
            })
          } else {
            this.workShopCurve = [{ name: '', list: [] }]
          }
          //       	console.log(res.data.data)
        } else {
          this.workShopCurve = [{ name: '', list: [] }]
        }
      }).catch(err => {
        console.log(err)
      })
    },
    //生产线list
    getlineList(id) {
      this.lineListData = {}
      this.lineListData2 = {}
      this.lineCurce = [{ name: '', list: [] }]
      this.linenum = 0
      this.lineLoading = true
      this.line_canvas_Loading = true
      let a = {}
      let b = {}
      Object.assign(a, this.cycleType,
        {          teamList: this.checkedCities0,
          "energyType": '01',
        },
        { unitId: id.toString() }
      );
      Object.assign(b, this.cycleType,
        {          teamList: this.checkedCities0,
          "energyType": '02',
        },
        { unitId: id.toString() }
      );
      this.$axios.post(this.Eelec + '/ennergy/comparativeAnalysis/lineList',
        a
      ).then(res => {
        this.lineLoading = false
        this.line_canvas_Loading = false
        if (res.data.code == 200) {
          this.lineListData = res.data.data
          this.lineelectricFlag = res.data.data.electricFlag
          this.linenum += 1
        }
      }).catch(err => {
        console.log(err)
      })
      this.$axios.post(this.Eelec + '/ennergy/comparativeAnalysis/lineList',
        b
      ).then(res => {
        this.lineLoading = false
        if (res.data.code == 200) {
          this.lineListData2 = res.data.data
          this.linesteamFlag = res.data.data.steamFlag
          this.linenum += 2

        }
      }).catch(err => {
        console.log(err)
      })
    },
    //生产线图
    getlineCurve(id) {
      this.lineCurce = [{ name: '', list: [] }]
      this.line_canvas_Loading = true
      let a = {}
      Object.assign(a, this.cycleType,
        { teamList: this.checkedCities3 },
        { energyType: '0' + this.application3 },
        { unitId: id.toString() }
      );
      this.$axios.post(this.Eelec + '/ennergy/comparativeAnalysis/lineCurve',
        a
      ).then(res => {
        this.line_canvas_Loading = false

        if (res.data.code == 200) {

          //						this.lineCurce=res.data.data
          if (res.data.data[0]) {
            this.lineCurce = res.data.data.map((item, index) => {
              return {
                name: item.team,
                value: item.list
              }
            })
          } else {
            this.lineCurce = [{ name: '', list: [] }]
          }
          //       	console.log(res.data.data)
        } else {
          this.lineCurce = [{ name: '', list: [] }]
        }
      }).catch(err => {
        console.log(err)
      })
    },
    //模拟一下前三个选中的方法
    defaultThree() {
      this.teamZList = this.checkedCities0.sort((a, b) => { return a.index - b.index })
      let a = this.teamZList.slice(0, 3)
      //		
      //			 this.getworkShopList()
      this.checkedCities1 = a
      this.checkedCities2 = a
      this.checkedCities3 = a
    },
    //公司多选框变化事件
    companychange() {
      if (this.radio == 0) {
        if (new Date(this.Starttime).getTime() <= new Date(this.Endtime).getTime()) {
          let chatime = new Date(this.Endtime).getTime() - new Date(this.Starttime).getTime()
          if (chatime >= 3600 * 1000 * 24 * 6 && chatime <= 3600 * 1000 * 24 * 92) {
            this.checkedCities1 = this.checkedCities1.sort((a, b) => { return a.index - b.index })
            this.companyCurve()
          } else {
            this.$message('时间区间最小为7天，最大为92天');
          }
        } else {
          this.$message('开始时间不能大于结束时间');
        }
      } else {
        this.checkedCities1 = this.checkedCities1.sort((a, b) => { return a.index - b.index })
        this.companyCurve()
      }

    },
    //车间多选框变化事件
    workShopchange() {
      if (this.radio == 0) {
        if (new Date(this.Starttime).getTime() <= new Date(this.Endtime).getTime()) {
          let chatime = new Date(this.Endtime).getTime() - new Date(this.Starttime).getTime()
          if (chatime >= 3600 * 1000 * 24 * 6 && chatime <= 3600 * 1000 * 24 * 92) {
            this.checkedCities2 = this.checkedCities2.sort((a, b) => { return a.index - b.index })
            this.getworkShopCurve(this.value_time)
          } else {
            this.$message('时间区间最小为7天，最大为92天');
          }
        } else {
          this.$message('开始时间不能大于结束时间');
        }
      } else {
        this.checkedCities2 = this.checkedCities2.sort((a, b) => { return a.index - b.index })
        this.getworkShopCurve(this.value_time)
      }

    },
    //		生产线多选框变化事件
    linechange() {
      if (this.radio == 0) {
        if (new Date(this.Starttime).getTime() <= new Date(this.Endtime).getTime()) {
          let chatime = new Date(this.Endtime).getTime() - new Date(this.Starttime).getTime()
          if (chatime >= 3600 * 1000 * 24 * 6 && chatime <= 3600 * 1000 * 24 * 92) {
            this.checkedCities3 = this.checkedCities3.sort((a, b) => { return a.index - b.index })
            this.getlineCurve(this.value_time2)
          } else {
            this.$message('时间区间最小为7天，最大为92天');
          }
        } else {
          this.$message('开始时间不能大于结束时间');
        }
      } else {
        this.checkedCities3 = this.checkedCities3.sort((a, b) => { return a.index - b.index })
        this.getlineCurve(this.value_time2)
      }

    },
    defa7() {
      this.Endtime = this.getFormatDate(new Date().valueOf() - 3600 * 1000 * 24)
      this.Starttime = this.getFormatDate(new Date().valueOf() - 3600 * 1000 * 24 * 7)
    }


  },
  created() {
    this.defa7()
    this.defaultThree()
    //请求班组

    this.getteams()



    //  console.log(this.cycleType)

  }
}
</script>
<style lang="scss" scoped>
h2 {
  padding: 0px 10px 0px 10px;
  font-size: 16px;
  line-height: 50px;
  height: 50px;
  color: #333333;
}
h3 {
  box-sizing: border-box;
  padding: 0 5px;
}

.statistical {
  color: #333;
  font-size: 20px;
  padding: 10px 0 10px 10px;
  display: table;
}
.ScreeningConditions {
  background: #ffffff;
  margin-bottom: 10px;
}
.body_table {
  background: #ffffff;
  margin-bottom: 10px;
}
.head_foot >>> .el-button--mini {
  padding: 10px 35px;
}

.MiddleTable {
  box-sizing: border-box;
  padding: 10px;
  min-height: 200px;
  position: relative;
}
.timeInterval {
  box-sizing: border-box;
  padding: 0px 0px 20px 0px;
  margin: 0px 20px 0px 20px;
  border-bottom: 1px solid #e9e9e9;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.body_canvas {
  background: #ffffff;
  margin-bottom: 10px;
  h3 {
    position: relative;
    display: flex;

    justify-content: space-between;
    .can_check {
      float: right;
      padding: 7px 0px;
      line-height: 30px;
      max-width: 690px;
      line-height: 30px;
    }
    .jingshi {
      position: absolute;
      right: 10px;
      bottom: 0;
      font-size: 12px;
      color: #666666;
    }
    .jingshi:before {
      content: "*";
      color: red;
    }
  }
  .Diagram {
    position: relative;
  }
  .twospan {
    color: #333333;
    font-size: 16px;
    display: flex;
    align-items: center;
    padding-right: 180px;
    flex-wrap: nowrap;
    span {
      /*display: inline-block;*/
      cursor: pointer;
      padding: 0 10px;
      flex: 1;
      height: 100%;
      display: flex;
      align-items: center;
    }
    .active {
      border-bottom: 3px solid #0780ed;
      color: #0780ed;
      height: 60px;
      padding-top: 3px;
    }
  }
}
</style>
